
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html dir="ltr" lang="en">
<head>
<title>IDE</title>

<style type="text/css">
@import "./css/jshintBeautify.css";

@import "./css/loginForm.css";

@import "./css/createFolder.css";

@import "./css/tab.css";

@import "./css/codemirror.css";

@import "./theme/ambiance.css";

@import "./theme/blackboard.css";

@import "./theme/cobalt.css";

@import "./theme/eclipse.css";

@import "./theme/elegant.css";

@import "./css/menu.css";

@import "./css/mbExtruder.css";

@import "./css/jqueryFileTree.css";

@import "./css/dialog.css";

@import "./css/simple-hint.css";

@import "./css/saveFileForm.css";

body{
    background-color:#000000;
}

#menu {
	margin-left:40px;
}

#account {
    color:white;
    text-align:right;
}

.extruder.left.a .flap {
	font-size: 18px;
	color: white;
	top: 0;
	padding: 10px 0 10px 10px;
	background: #772B14;
	width: 30px;
	position: absolute;
	right: 0;
	-moz-border-radius: 0 10px 10px 0;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	-moz-box-shadow: #666 2px 0px 3px;
	-webkit-box-shadow: #666 2px 0px 3px;
}

.extruder.left.a .content {
	border-right: 3px solid #772B14;
	background: rgba(255, 255, 255, .95);
}

.extruder.left.a .flap .flapLabel {
	background: #772B14;
}

#container {
	margin-top:20px;
}

#error {
	background-color: transparent;
	border: none;
	padding: 30px;
	width: 100%;
}

</style>
<script type="text/javascript" src="./lib/jquery.js"></script>
<script type="text/javascript" src="./lib/jquery-ui.min.js"></script>
<script type="text/javascript" src="./javascript/preference.js"></script>
<script type="text/javascript" src="./lib/codemirror.js"></script>
<script type="text/javascript" src="./mode/javascript/javascript.js"></script>
<script type="text/javascript" src="./mode/htmlmixed/htmlmixed.js"></script>
<script type="text/javascript" src="./mode/css/css.js"></script>
<script type="text/javascript" src="./mode/xml/xml.js"></script>

<script type="text/javascript" src="./lib/FileSaver.js"></script>
<script type="text/javascript" src="./lib/BlobBuilder.js"></script>


<script type="text/javascript" src="./javascript/domtab.js"></script>
<script type="text/javascript" src="./javascript/filefolder.js"></script>
<script type="text/javascript" src="./javascript/cmeditor.js"></script>
<script type="text/javascript" src="./javascript/control.js"></script>
<script type="text/javascript" src="./javascript/help.js"></script>

<script type="text/javascript" src="./lib/menu.js"></script>

<script type="text/javascript" src="./lib/jquery.hoverIntent.min.js"></script>
<script type="text/javascript" src="./lib/jquery.mb.flipText.js"></script>
<script type="text/javascript" src="./lib/mbExtruder.js"></script>
<script type="text/javascript" src="./lib/jquery.metadata.js"></script>

<script type="text/javascript" src="./lib/shortcut.js"></script>
<script type="text/javascript" src="./javascript/shortcutbinding.js"></script>
<script type="text/javascript" src="./javascript/menubinding.js"></script>

<script type="text/javascript" src="./lib/jquery.easing.js"></script>
<script type="text/javascript" src="./lib/jqueryFileTree.js"></script>


<script type="text/javascript" src="./lib/util/dialog.js"></script>
<script type="text/javascript" src="./lib/util/searchcursor.js"></script>
<script type="text/javascript" src="./lib/util/search.js"></script>
<script type="text/javascript" src="./lib/util/simple-hint.js"></script>
<script type="text/javascript" src="./lib/util/javascript-hint.js"></script>
<script type="text/javascript" src="./lib/util/match-highlighter.js"></script>
<script type="text/javascript" src="./lib/util/closetag.js"></script>
<script type="text/javascript" src="./lib/util/formatting.js"></script>
<script type="text/javascript" src="./lib/util/foldcode.js"></script>

<script type="text/javascript" src="./lib/util/beautify.js"></script>
<script type="text/javascript" src="./lib/util/jshint.js"></script>
<script type="text/javascript" src="./javascript/addComment.js"></script>
<script type="text/javascript" src="./javascript/createBeautifyDiv.js"></script>
<script type="text/javascript" src="./javascript/createJshintOptionDiv.js"></script>
<script type="text/javascript" src="./javascript/createLoginDiv.js"></script>
<script type="text/javascript" src="./javascript/createRegisterDiv.js"></script>
<script type="text/javascript" src="./javascript/createFolder.js"></script>
<script type="text/javascript" src="./javascript/createSaveFileDiv.js"></script>

<script type="text/javascript" src="./javascript/initialize.js"></script>

</head>

<body>
    
    <div id="account">
        <div><a id="login">Login</a> | <a id="register">Register</a> | <a id="logout">Logout</a></div>
	</div>

	<div id="menu">
		<ul class="menu">
			<li><a href="#" class="parent" id="1"><span>File</span></a>
				<div>
					<ul>
						<li><a href="#" id="1.1"><span>New File Ctrl-N</span></a></li>
						<li><a href="#" id="1.3"><span>New Folder</span></a></li>
						<li><a href="#" id="1.5"><span>Download Project</span></a></li>
						<li><a href="#" id="1.6"><span>Open Ctrl-E</span></a></li>
						<li><a href="#" id="1.8"><span>Save Ctrl-S</span></a></li>
						<li><a href="#" id="1.9"><span>Save As
									Ctrl-Shift-S</span></a></li>
						<li><a href="#" id="1.10"><span>Save All</span></a></li>
						<li><a href="#" id="1.11"><span>Close File Ctrl-W</span></a></li>
						<li><a href="#" id="1.12"><span>Close All</span></a></li>
					</ul>
				</div></li>
			<li><a href="#" id="2"><span>Edit</span></a>
				<div>
					<ul>
						<li><a href="#" id="2.1"><span>Undo Ctrl-Z</span></a></li>
						<li><a href="#" id="2.2"><span>Redo Ctrl-Shift-Z |
									Ctrl-Y</span></a></li>
						<li><a href="#" class="parent" id="2.6"><span>Line</span></a>
							<div>
								<ul>
									<li><a href="#" id="2.6.1"><span>In dent Tab</span></a></li>
									<li><a href="#" id="2.6.2"><span>Out dent
												Shift-Tab</span></a></li>
									<li><a href="#" id="2.6.3"><span>Move Line Up
												Alt-Up</span></a></li>
									<li><a href="#" id="2.6.4"><span>Move Line Down
												Alt-Down</span></a></li>
									<!-- <li><a href="#" id="2.6.5"><span>Copy Line Up -->
									<!-- 			Alt-Shift-Up</span></a></li> -->
									<li><a href="#" id="2.6.6"><span>Copy Line Down
												Alt-Shift-Down</span></a></li>
									<li><a href="#" id="2.6.7"><span>Remove Line
												Ctrl-D</span></a></li>
									<li><a href="#" id="2.6.8"><span>Remove To Line
												End Alt-Delete</span></a></li>
									<li><a href="#" id="2.6.9"><span>Remove To Line
												Start Alt-Backspace</span></a></li>
									<li><a href="#" id="2.6.10"><span>Split Line</span></a></li>
								</ul>
							</div></li>
						<li><a href="#" class="parent" id="2.7"><span>Comment</span></a>
							<div>
								<ul>
									<li><a href="#" id="2.7.1"><span>Toggle Comment
												Ctrl-1</span></a></li>
									<li><a href="#" id="2.7.2"><span>Remove Comment Ctrl-Shift-1</span></a></li>
								</ul>
							</div></li>
						<li><a href="#" class="parent" id="2.8"><span>Text</span></a>
							<div>
								<ul>
									<li><a href="#" id="2.8.1"><span>Remove Word
												Right Ctrl-Delete</span></a></li>
									<li><a href="#" id="2.8.2"><span>Remove Word
												Left Ctrl-Backspace</span></a></li>
								</ul>
							</div></li>
						<li><a href="#" class="parent" id="2.9"><span>Code
									Folding</span></a>
							<div>
								<ul>
									<li><a href="#" id="2.9.1"><span>Fold Alt-L ||
												Ctrl - F1</span></a></li>
									<!-- <li><a href="#" id="2.9.2"><span>Unfold -->
									<!-- 			Alt-Shift-L || Ctrl-Shift-F1</span></a></li> -->
									<li><a href="#" id="2.9.3"><span>Fold All Alt-Shift-L</span></a></li>
									<!-- <li><a href="#" id="2.9.4"><span>Unfold All -->
									<!-- 			Alt-Shift-0</span></a></li> -->
								</ul>
							</div></li>
						<li><a href="#" class="parent" id="2.10"><span>Convert
									Case</span></a>
							<div>
								<ul>
									<li><a href="#" id="2.10.1"><span>Upper Case
												Ctrl-U</span></a></li>
									<li><a href="#" id="2.10.2"><span>Lower Case
												Ctrl-Shift-U</span></a></li>
								</ul>
							</div></li>
					</ul>
				</div></li>
			<li><a href="#" id="3"><span>Selection</span></a>
				<div>
					<ul>
						<li><a href="#" id="3.1"><span>Select All Ctrl-A</span></a></li>
						<li><a href="#" id="3.2"><span>Select Word Right
									Ctrl-Shift-Right</span></a></li>
						<li><a href="#" id="3.3"><span>Select Word Left
									Ctrl-Shift-Left</span></a></li>
						<li><a href="#" id="3.4"><span>Select to Line End
									Alt-Shift-Right</span></a></li>
						<li><a href="#" id="3.5"><span>Select to Line
									Start Alt-Shift-Left</span></a></li>
					</ul>
				</div></li>
			<li><a href="#" id="4"><span>Find</span></a>
				<div>
					<ul>
						<li><a href="#" id="4.7"><span>Find Ctrl-F</span></a></li>
						<li><a href="#" id="4.1"><span>Find Next Ctrl-K</span></a></li>
						<li><a href="#" id="4.2"><span>Find Previous
									Ctrl-Shift-K</span></a></li>
						<li><a href="#" id="4.3"><span>Replace Next
									Alt-Shift-F</span></a></li>
						<li><a href="#" id="4.5"><span>Replace All</span></a></li>
					</ul>
				</div></li>
			<li><a href="#" id="5"><span>View</span></a>
				<div>
					<ul>
						<li><a href="#" class="parent" id="5.2"><span>Tabs</span></a>
							<div>
								<ul>
									<li><a href="#" id="5.2.1"><span>Close Tab
												Ctrl-W</span></a></li>
									<li><a href="#" id="5.2.2"><span>Close All
												Ctrl-Shift-W</span></a></li>
									<li><a href="#" id="5.2.3"><span>Close Others
												Ctrl-Alt-W</span></a></li>
									<li><a href="#" id="5.2.4"><span>Load Tab
												Session </span></a></li>
								</ul>
							</div></li>
						<li><a href="#" id="5.4"><span>Gutter (show or
									hide)</span></a></li>
						<li><a href="#" id="5.5"><span>Status Bar (show or
									hide)</span></a></li>
						<li><a href="#" class="parent" id="5.7"><span>Syntax</span></a>
							<div>
								<ul>
									<li><a href="#" id="5.7.1"><span>HTML</span></a></li>
									<li><a href="#" id="5.7.2"><span>CSS</span></a></li>
									<li><a href="#" id="5.7.3"><span>Javascript</span></a></li>
								</ul>
							</div></li>
						<li><a href="#" class="parent" id="5.8"><span>Themes</span></a>
							<div>
								<ul>
									<li><a href="#" id="5.8.1"><span>Ambiance</span></a></li>
									<li><a href="#" id="5.8.2"><span>Blackboard</span></a></li>
									<li><a href="#" id="5.8.3"><span>Cobalt</span></a></li>
									<li><a href="#" id="5.8.4"><span>Eclipse</span></a></li>
									<li><a href="#" id="5.8.5"><span>CodeMirror</span></a></li>
									<li><a href="#" id="5.8.6"><span>Elegant</span></a></li>
								</ul>
							</div></li>
						<li><a href="#" id="5.9"><span>Wrap Lines</span></a></li>
					</ul>
				</div></li>

			<li><a href="#" id="7"><span>Tools</span></a>
				<div>
					<ul>
						<li><a href="#" class="parent"><span>Quick Outline
							</span></a>
							<div>
								<ul>
									<li><a href="#"><span>highlighting selection
												matches </span></a></li>
								</ul>
							</div></li>
						<li><a href="#" id="7.4"><span>Code Formatting</span></a></li>
						<li><a href="#" id="7.7"><span>JShint</span></a></li>
						<li><a href="#" id="7.8"><span>Beautify</span></a></li>
					</ul>
				</div></li>

			<li class="last"><a href="#"><span>Help</span></a>
				<div>
					<ul>
						<li><a href="#"><span>About</span></a></li>
						<li><a href="#"><span>Documentation </span></a></li>
						<li><a href="#"><span>Keyboard Shortcuts</span></a></li>
					</ul>
				</div></li>
		</ul>
	</div>
	
	<div id="extruderLeft"
		class="a {title:'file list', url:'parts/empty.html'}">
		<div class="example">
			<div id="fileTreeDemo_1" class="demo"></div>
		</div>
	</div>

	<div id="container">
		<div class="domtab">
			<ul class="domtabs"></ul>
			<textarea id="spacer" cols=100 rows=30 readonly="readonly">
			</textarea>
			<!--
                <ul class="domtabs">  (log here, currentTitle, currentContent)
                    <li id="id<num>" class="active">  (currentTitle)
                        <a href="#id<num>" background = "url(_blank.png)" name="TitleName" status="" title="TitleName">TitleName</a>
                        <img src = "close_idle.png" onMouseOver = "this.src='close_active.png'" 
                        		onMouseOut = "this.src='close_idle.png'" onclick = "domtab.closeTab"/>
                    </li>
                </ul>
                <div class="bar">
                    <input type="text" class="search" >
                </div>
				<div id="id<num>" class="window"> (currentContent)
					<textarea id="code_id<num>" cols=100 rows=40>Content</textarea>
                </div>
            -->
		</div>
		<div id="statusbar">
			Ln <span id="row">1</span>, Col <span id="column">1</span>
		</div>
	</div>
	<div id="extruderBottom" class="{title:'Console', url:'parts/empty.html'}">
		<div><textarea id="error" rows =10></textarea></div>
	</div>
	<a href="http://apycom.com/"></a>
</body>
</html>
